<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="f" uri="http://www.springside.org.cn/tags/form" %>
<%@ taglib prefix="s" uri="http://www.springside.org.cn/tags/shiro" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
</head>
<body>

<!--搜索栏开始 -->
<div class="row">
    <f:form action="?" id="form_search" modelAttribute="${NAME}" method="post"
            cssClass="well well-small form-inline">
        <label>名称：</label>
        <f:input path="name" cssClass="input-small"></f:input>

        <button class="btn btn-info" type="button" id="btn_search">
            <span class="icon-search icon-white"></span>
            查询
        </button>
        <button class="btn btn-info" type="reset">
            <span class="icon-repeat icon-white"></span>
            重置
        </button>
    </f:form>
</div>
<!--搜索栏结束 -->


<!--工具栏开始-->
<div class="pull-right btn-toolbar row">
    <div class="btn-group">
         <s:hasPermission name="${NAME}:add">
            <button class="btn btn-success" type="button" id="btn_add">
                <span class="icon-plus icon-white"></span>
                新增
            </button>
        </s:hasPermission>
        <s:hasPermission name="${NAME}:del">
            <button class="btn btn-danger" type="button" id="btn_del">
                <span class="icon-minus icon-white"></span>
                删除
            </button>
        </s:hasPermission>
        <s:hasPermission name="${NAME}:edit">
            <button class="btn btn-info" type="button" id="btn_upd">
                <span class="icon-edit icon-white"></span>
                修改
            </button>
        </s:hasPermission>
    </div>
</div>
<!--工具栏结束-->


<!--表格开始-->
<div class="row">
    <table id="list_table" style="width: 100%;">
        <thead>
        <tr>
            <th w_index="id" w_hidden="true">ID</th>
            <th w_num="line" w_align="center">序号</th>
            <th w_index="name">名称</th>
            <th w_render="renderStatusLabel" w_align="center">有效状态</th>
            <th w_index="modTime">修改时间</th>
        </tr>
        </thead>
    </table>
</div>
<!--表格结束-->


<!--新增/修改-->
<div class="modal hide" id="modal_add">
    <f:form action="?action=update" class="form-horizontal" modelAttribute="${NAME}" id="form_add"
            method="post">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4>添加/修改</h4>
        </div>
        <div class="modal-body">
            <div class="control-group">
                <label class="control-label" for="add_name">名称</label>
                <div class="controls">
                    <input type="text" name="name" id="add_name" placeholder="菜单名称" required />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="add_url">URL</label>
                <div class="controls">
                    <input type="text" name="url" id="add_url" placeholder="菜单URL" />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="add_sort">排序</label>
                <div class="controls">
                    <input type="number" name="sort" id="add_sort" placeholder="菜单显示顺序" />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label">有效状态</label>
                <div class="controls">
                    <label for="add_status_1" class="radio inline">
                        <f:radiobutton id="add_status_1" path="status" label="正常" value="1"
                                       checked="checked"></f:radiobutton>
                    </label>
                    <label for="add_status_0" class="radio inline">
                        <f:radiobutton id="add_status_0" path="status" label="停用" value="0"></f:radiobutton>
                    </label>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">
                <span class="icon-remove"></span>
                关闭
            </button>
            <button class="btn btn-primary" id="btn_save" type="submit">
                <span class="icon-file icon-white"></span>
                保存
            </button>
        </div>
    </f:form>
</div>
<!--新增/修改-->

<script type="text/javascript">
    var gridObj;

    $(function () {
        //初始化表格,参数("表格id","搜索表单id")
        gridObj = initBsGrid("list_table", "form_search");

        //初始表单验证
        initValidation();

        var modalAdd = $("#modal_add");
        var formAdd = $("#form_add");
        var addId = $("#add_id");

        //查询按钮
        $("#btn_search").bind("click", function () {
            refreshTable(gridObj, true);
        });

        //添加按钮
        $("#btn_add").bind("click", function () {
            modalAdd.modal();//弹出框
            formAdd.resetForm();//重置表单
            resetValidation();//重置校验
            addId.attr("readonly", null);
        });

        //保存
        $("#btn_save").bind("click", function () {
            formAdd.ajaxForm({
                success: function (t) {
                    //显示操作提示
                    $.bootstrapGrowl(t.message);
                    if (t.error == false) {//操作成功时error=true，其它表示操作失败
                        modalAdd.modal("hide");//隐藏弹出框
                        refreshTable(gridObj);//刷新表格
                    }
                }
            });
        });

        //删除按钮
        $("#btn_del").bind("click", function () {
            var rowIndex = gridObj.grid.getSelectedRowIndex();//获取当前选中行的索引
            if (rowIndex == -1) {
                bootbox.alert("请先选择一行数据！");
                return;
            }
            bootbox.confirm("确定要删除此条数据吗？", function (r) {
                if (!r) {
                    return;
                }
                var id = gridObj.grid.getColumnValue(rowIndex, "id");//获取单元格的值
                $.post("?action=delete", {"id": id}, function (t) {
                    //显示操作提示
                    $.bootstrapGrowl(t.message);
                    if (t.error == false) {//操作成功时error=true，其它表示操作失败
                        refreshTable(gridObj);//刷新表格
                    }
                });
            });
        });

        //修改按钮
        $("#btn_upd").bind("click", function () {
            var rowIndex = gridObj.grid.getSelectedRowIndex();
            if (rowIndex == -1) {
                bootbox.alert("请先选择一行数据！");
                return;
            }
            formAdd.resetForm();//重置表单
            resetValidation();
            var id = gridObj.grid.getColumnValue(rowIndex, "id");
            //根据id查询数据库中的值
            $.post("?action=get", {"id": id}, function (t) {
                if (t.error == true) {
                    $.bootstrapGrowl(t.message, {type: 'danger'});
                } else {
                    formAdd.frmDeSerialize(t);//使用json填充表单，将json中的值自动设置到表单的每个元素上
                    modalAdd.modal();
                }
            });
        });
    });
</script>

</body>
</html>